/** CSS Reset **/
/** simple reset **/

html, body, ul, ol, li, form, fieldset, legend{margin: 0;padding: 0;}
h1, h2, h3, h4, h5, h6, p { margin-top: 0; }
fieldset,img { border: 0; }
legend { color: #000; }
li { list-style: none; }
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom; }
table{border-collapse: collapse;border-spacing: 0;}
caption, th, td{text-align: left;vertical-align: top;font-weight: normal;}
input, textarea, select{font-size: 110%;line-height: 1.1;}
abbr, acronym{border-bottom: .1em dotted;cursor: help;}
ul.list,ol.list {padding:0px 15px;}
ul.list li{list-style:disc outside none;padding:10px;}
ol.list li{list-style:decimal outside none;padding:10px;text-align:justify;}

/** zz reset **/
a{text-decoration:none;color:#3F3F3F;display:inline-block;cursor:pointer;}
a:hover{text-decoration:underline;color:#3F3F3F;}
input[type="submit"],input[type="reset"],input[type="button"],button{border:0;cursor:pointer;}
input[type="text"],input[type="password"]{border:0;display:inline-block;}

/** zz.tools.js **/
/** functional + validate **/
div#loadingWrapper { 
	position: fixed; width: 100%; height: 100%; 
	background: white url(../img/colorbox/loading.gif) no-repeat center; 
	margin: 0; top: 0; z-index: 1000; opacity: 0.7; filter: alpha(opacity=70); }
.loading{width:100%;height:100%;
	background: white url(../img/colorbox/loading.gif) no-repeat center;
	opacity: 0.7; filter: alpha(opacity=70);
}
.clear{clear:both;}
.iv{color:white;background-color:black;border:3px dotted black;}
.clicktohide,.clicktohideparent,.clicktoexpand,.clicktoexpandnext,.hovertoshow,
.bt1,.bt2,.bt3{cursor:pointer;}
.hide{display:none;}
.selectfalse{user-select: none; 
	-moz-user-select: -moz-none;-khtml-user-select: none;-webkit-user-select: none;}

span.light-red		{width:10px;height:10px;background-color:#E55;display:inline-block;border:2px solid #955;border-radius:10px;box-shadow:0px 1px 1px #444;}
span.light-orange	{width:10px;height:10px;background-color:#E85;display:inline-block;border:2px solid #965;border-radius:10px;box-shadow:0px 1px 1px #444;}
span.light-green	{width:10px;height:10px;background-color:#5E5;display:inline-block;border:2px solid #595;border-radius:10px;box-shadow:0px 1px 1px #444;}
span.light-grey		{width:10px;height:10px;background-color:#BBB;display:inline-block;border:2px solid #999;border-radius:10px;box-shadow:0px 1px 1px #444;}

/** style **/
::selection {background: rgba(150,0,0,0.8);color:#FFF;}
::-moz-selection {background: rgba(150,0,0,0.8);color:#FFF;}

.flash-success { background: #00ab00; color: white; font-size: 11pt; font-weight: bold; padding: 6px 8px; }
.flash-error   { background: #ab0000; color: white; font-size: 11pt; font-weight: bold; padding: 6px 8px; }
.flash-notice  { background: #8adF8a; color: #444;  font-size: 11pt; font-weight: bold; padding: 6px 8px; }

.form .errorSummary {border: 2px solid #C00;background: #FEE;font-size: 0.9em;padding:7px;margin: 20px 0;}
	.form .errorSummary ul{padding: 0 0 0 20px;}
	
.form div.error{}
	.form div.error label{}
	.form div.error input[type='text'],
	.form div.error textarea,
	.form div.error select,
	.form div.error input[type='password']{
		background: #FEE;
		border-color: #C00;
	}
	.form div.error label{}
	.form div.errorMessage { background: #ab0000; color: white; font-size: 11pt; 
		padding: 2px 4px; margin:2px 0; width:270px; }


/********
 * form
 ********/
label{display:inline-block;margin:5px 0 0 0px;}
input[type="text"],input[type="password"],textarea{
	padding:3px;font-size:11pt;border:1px solid #EEE;width:270px;}
select{font-size:11pt;border:1px solid #EEE;width:270px;padding:1px;}
	select option{padding:1px;}
input[type="text"].small{font-size:0.85em;width:50%;display:inline;}
select.small{font-size:0.85em;width:50%;display:inline;}

button,a.bt1,a.bt2,a.bt3{
	border: 1px solid rgba(152, 152, 152, 0.1);border-radius: 2px;color: #666666;cursor: pointer;
	font-size: 8pt;font-weight: bold;min-width: 54px;padding: 4px 8px;text-align: center;
}
button,button.bt1,a.bt1 { background-color: #F5F5F5; }
button.bt2,a.bt2 		{ background-color: #F5F5F5; color:#BF0000; }
button.bt3,a.bt3 		{ background-color: #BF0000; color:#EFEFEF; }
button:hover,a.bt1:hover,a.bt2:hover,a.bt3:hover{
	border: 1px solid rgba(208, 0, 0, 0.1); text-decoration:none;
}
span.inputtext{font-height:12px;}

table.form2c-search th {padding:0px 20px;}
	table.form2c-search th label {font-weight:bold;}

table.form2c-search td{padding:2px;}
	table.form2c-search input[type="text"] { font-size:10pt; border:1px solid #999;}

th.sortable span.icon {float:right;margin:4px 8px;display:inline-block;width:13px;height:7px;background:transparent url('images/ico-sortdir.gif') no-repeat center;}
th.sortable.asc span.icon{background-position:bottom;}
th.sortable.desc span.icon{background-position:top;}

/********
 * table
 ********/
div.box{background-color:#FFF;border:1px solid #DDD; display:block; 
	border-radius: 6px; box-shadow:1px 1px 2px #888;
}
	div.box div.filter{
		padding:6px 20px;
		font:normal 9pt arial;
	}

		div.box div.filter.cap{
			border-top-left-radius: 4px;
			border-top-right-radius: 4px;
		}

		div.box div.filter.tail{
			border-bottom-left-radius: 4px;
			border-bottom-right-radius: 4px;
		}	
		div.box div.filter.blue{
			color:#EFEFEF;
			text-shadow: 1px 1px 1px #000;
			background-color:#035;
		}
		div.box div.filter.blue a{color: #DDF;font-weight:bold;}

		div.box div.filter.silver{
			color:#404040;
			text-shadow: 1px 1px 1px #fff;
			background-color:rgb(198,198,198);
			background-image: -webkit-gradient(
				linear,
				left bottom,
				left top,
				color-stop(0, rgb(198,198,198)),
				color-stop(1, rgb(229,229,229))
			);
			background-image: -moz-linear-gradient(
				center bottom,
				rgb(198,198,198) 0%,
				rgb(229,229,229) 100%
			);
		}
		div.box div.filter table td{ vertical-align:middle; }


div.box table{width:100%;}
	div.box table th{text-align:left;padding:8px 10px;font-weight:bold;text-shadow:#FFF 0px 1px 1px; }
	div.box > table tbody tr {background-color:#f3f3f3;}
	div.box > table thead tr th{background-color:#e6e6e6; vertical-align:middle; 
		border-left:0px solid #d9d9d9;
		background-image: -webkit-gradient(
			linear,
			left bottom,
			left top,
			color-stop(0, rgb(227,227,227)),
			color-stop(1, rgb(238,238,238))
		);
		background-image: -moz-linear-gradient(
			center bottom,
			rgb(227,227,227) 0%,
			rgb(238,238,238) 100%
		);
	}
	div.box > table thead tr th:first-child{border-top-left-radius: 4px;}
	div.box > table thead tr th:last-child{border-top-right-radius: 4px;}
	div.box > table tbody tr td,
		div.box table > tfoot tr td{border-left:0px solid #d9d9d9;padding:8px;}
	div.box > table tbody tr td:first-child,
		div.box table > tfoot tr td:first-child,
		div.box table > thead tr th:first-child{border-left:0;}
	div.box table.boxlist tbody tr:nth-child(even) {background-color:#FFF;}

table.form2c{width:100%;}
table.form2c tbody th{text-align:left;border-bottom:1px solid #CCC;}
table.form2c tbody th h3{font-size:19pt;font-weight:normal;padding:10px 0 0 0;margin:0;}
table.form2c tbody td{ padding:2px 20px; }
table.form2c tbody td:first-child {padding-left:50px;text-align:right;border-right:1px solid #CCC;text-transform:uppercase;}
table.form2c tbody td select{font-size:12pt;}
table.form2c tbody td input[type="text"]{font-size:12pt;}

div.modal{position:relative;margin:80px auto 20px auto;width:300px;padding:30px 100px;border:1px solid #DDD;border-radius:15px;background-color:#EEE;}

span.abbr{display:inline-block;width:16px;height:16px;background:transparent url(/img/icons/help.png);position:relative;}
span.abbr div.hide{position:absolute;width:200px;border:1px solid #EEE;left:-100px;bottom:0px;padding:10px;background-color:rgba(255,255,255,0.8);border-radius:5px;}
span.abbr:hover div.hide{display:block;}

/********
 * table important overide
 ********/
table .nocorner{ -moz-border-radius: 0 !important; border-radius: 0 !important;}
table .nopad{padding:0 !important;}
table .smallpad{padding:4px !important;}
table .tcenter{text-align:center !important;}

/********
 *	responsive content
 ********/
body,button,a,input,textarea,select,table,td { transition:all .2s linear; -o-transition:all .2s linear; -moz-transition:all .2s linear; -webkit-transition:all .2s linear;}

@media screen and (max-height:450px) {

	body{font-size:8pt;}
	div.box > table tbody tr td,
		div.box table tfoot tr td{padding:2px 10px;}
	button,a.bt1,a.bt2,a.bt3{padding: 2px 8px;}
	div.box div.filter{padding:2px 20px;}
	div.box > table th{padding:4px 10px; }
	

	table.form2c-search td{padding:2px;}
		table.form2c-search input[type="text"] { font-size:7pt;}
	select{font-size:7pt;}

}